<!DOCTYPE html>
<html>
<head>
 <meta charset="utf-8">
 <title></title>
 <script type="text/javascript" src="lib/easeljs-0.7.1.min.js"></script>
 <script type="text/javascript" src="lib/tweenjs-0.5.1.min.js"></script>
</head>
<body onload="init()">
 <canvas id="mycanvas" width="800px" height="800px" style="border:1px solid #ccc;"></canvas>
</body>
</html>

<script type="text/javascript">
 var stage;
 function init(){
  stage = new createjs.Stage(document.getElementById("mycanvas"));
  createjs.Ticker.setFPS(60);
  createjs.Ticker.addEventListener('tick',function(e){
   stage.update()
  })
  //sample()
  sample2()
 }

 function sample(){
  var container = new createjs.Container();
  var eling = new createjs.Bitmap("image/papper.png");
  var txt = new createjs.Text("Eling pepper","20px Arial","#000");
  var bg = new createjs.Shape(new createjs.Graphics().beginStroke("#000")
   .drawRect(0,0,200,200));
  txt.x = txt.y = 10;
  eling.x = eling.y = 50;
  container.regX = container.regY = 125;
  container.x = 300;
  container.y = 200;
  container.addChild(eling,txt,bg)
  stage.addChild(container);
  createjs.Tween.get(container).to({rotation:360},4000);
 }

 function sample2() {
  var container = new createjs.Container();
  var eling = new createjs.Bitmap("image/papper.png");
  var txt = new createjs.Text("Eling pepper","20px Arial","#000");
  var bg = new createjs.Shape(new createjs.Graphics().beginStroke("#000")
   .drawRect(0,0,200,200));
  txt.x = txt.y = 10;
  eling.x = eling.y = 50;
  container.regX = container.regY = 125;
  container.x = 300;
  container.y = 200;
  container.addChild(eling,txt,bg)
  container2 = container.clone(true)
  container2.x = 430,
  container2.y = 300,
  stage.addChild(container,container2)
 }
</script>